/*
 * Responsive.less v2.0 
 * Author:iRuxu
 * Creat:2014.8
 * Update:2015.6.11
 * https://github.com/iRuxu/LessLab
 */
 //-x表示的是横屏，-y表示竖屏
@screen-xl:100%;
@screen-l:100%;
@screen-m:100%;
@screen-s:100%;
@screen-xs:100%;
@screen-pad:100%;
@screen-pad-x:100%;
@screen-pad-y:300%;
@screen-phone:100%;
@screen-phone-x:100%;
@screen-phone-y:200%;
/*新PC适配方案（JS）
----------------------------------------*/
//XL:1580  台式机1600×900/1680×1050/1920×1080/1920×1200
.screen-xl{
	html{
		font-size:@screen-xl;
	}
}
//L:1400 台式机1440×900
.screen-l{
	html{
		font-size:@screen-l;
	}
}
//M:1180 笔记本1280×1024，1366×768
.screen-m{
	html{
		font-size:@screen-m;
	}
}
//S:940 平板横屏、老年人
.screen-s{
	html{
		font-size:@screen-s;
	}
}
//XS:720 平板竖屏、安卓平板、超大屏手机
.screen-xs{
	html{
		font-size:@screen-xs;
	}
}


//平板适配（媒体查询）
//当屏幕尺寸小于等于1024且大于等于768时的横屏与竖屏适配，在屏幕尺寸在此区间时，主动拖拽浏览器窗口变小则最小宽度仍保留768。
@media only screen and (min-device-width:768px) and (max-device-width:1024px){
    html{
		font-size:@screen-pad;
	}
}
//横屏
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape){
    html{
		font-size:@screen-pad-x;
	}
}
//竖屏
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:portrait){
    html{
		font-size:@screen-pad-y;
	}
}

/*手机适配
----------------------------------------*/
//当屏幕尺寸小于等于720且大于等于320时的横屏与竖屏适配。
//手机上不考虑浏览器主动拖拽，不考虑小于320尺寸的古董或超小屏手机。
//如果PC项目不做手机适配则以下适配场景请删除，它自己会以页面整体缩小至适应窗口。
@media only screen and (min-device-width:320px) and (max-device-width:720px){
	html{
		font-size:@screen-phone;
	}
}
//横屏
@media only screen and (min-device-width:320px) and (max-device-width:720px) and (orientation:landscape){
	html{
		font-size:@screen-phone-y;
	}
}
//竖屏
@media only screen and (min-device-width:320px) and (max-device-width:720px) and (orientation:portrait){
	html{
		font-size:@screen-phone-y;
	}
}